<template>
    <div class="container-xl">
        <div class="row row1">
            <div class="col col1">{{ title }}</div>
        </div>
        <div class="row">
            <div class="col">
                <!-- 不是全局组件 -->
                <createdactivityVue v-bind="{ teamid, ID, isAdmin: false }"
                    :createdorupdateactivtiy="createdorupdateactivtiy" :delactivity="asyncteamdelactivity"
                    :routers="{ name: '比赛配置' }">
                </createdactivityVue>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import { computed, inject, onMounted, ref, watch } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { asyncgetteam, asyncteamcreateorupdateactivity, asyncteamdelactivity } from '../../../api';
import Studycodemodel from '../../../mysql_interface/studycodemodel';
import createdactivityVue from '@/components/activity/createdactivity.vue';
const p = defineProps<{ ID: number }>()
const router = useRouter()
const route = useRoute()
const teamid = computed(() => {
    return Number(route.params.ID)
})

// 码客行
const tenant_id = inject<string | undefined>('tenant_id', undefined)

async function createdorupdateactivtiy(data: {
    data: Studycodemodel.Iactivity;
    question: Studycodemodel.Imatchquestion[];
    teamid?: number | undefined;
    users: Studycodemodel.Iuser[]
}) {
    data.data = {
        ...data.data,
        tenant_id: teamInfo.value?.tenant_id || undefined
    }
    const t = await asyncteamcreateorupdateactivity(data)
    return t
}


const ID = computed(() => {
    return Number(route.query.ID)
})
watch(() => ID.value, (v) => {
    if (v) {
        start()
    }
})
const title = computed(() => {
    return ID.value ? "修改比赛" : "创建比赛"
})

onMounted(() => {
    start()
})
// 
const teamInfo = ref<Studycodemodel.Iteam>({})
async function start() {
    // 获取团队信息
    teamInfo.value = await asyncgetteam({ ID: teamid.value });
}

</script>

<style scoped>
.container-xl {
    background-color: #fff;
    margin: 0;
}

.row1 {
    margin-top: 24px;
    margin-bottom: 24px;
    font-weight: 700;
    font-size: 18px;
    line-height: 24px;
    color: var(--color-43);
}

.col1 {
    padding-left: 20px;
}
</style>
